//确认框
.hv-dark-confirm {
  .ant-modal {
    color: var(--hv-confirm-color);
  }
  .ant-modal-content {
    background-color: var(--hv-confirm-bg);
    color: var(--hv-confirm-color);
  }
  .ant-modal-confirm-title {
    color: var(--hv-confirm-color);
  }
  .ant-modal-confirm-content {
    color: var(--hv-confirm-color);
  }
  .ant-btn {
    &:not(.ant-btn-primary) {
      background-color: var(--hv-confirm-btn-bg);
      color: var(--hv-confirm-color);
      border-color: var(--hv-confirm-btn-bor-color);
      &:hover{
        border-color: var(--hv-primary-color);
        color: var(--hv-primary-color);
      }
    }
  }
}

// 弹出框
.hv-dark-dialog {
  .ant-modal-content {
    background-color: var(--hv-dialog-bg);
    color: var(--hv-dialog-color);
  }
  .ant-modal-header {
    background-color: var(--hv-dialog-header-bg);
    color: var(--hv-dialog-color);
    border-bottom-color: var(--hv-dark-bor-color);
  }
  .ant-modal-title {
    color: var(--hv-dialog-color);
  }
  .ant-modal-footer {
    border-top-color: var(--hv-dark-bor-color);
    background-color: var(--hv-dialog-footer-bg);
  }
  .ant-modal-close {
    color: var(--hv-dialog-color);
  }

  .ant-btn {
    &:not(.ant-btn-primary) {
      background-color: var(--hv-dialog-btn-bg);
      color: var(--hv-dialog-color);
      border-color: var(--hv-dialog-btn-bor-color);
      &:hover{
        border-color: var(--hv-primary-color);
        color: var(--hv-primary-color);
      }
    }
  }
}

//气泡框
.hv-dark-popover {
  .ant-popover {
    color: var(--hv-popover-color);
  }
  .ant-popover-arrow-content{
    background-color: var(--hv-popover-bg);
  }
  .ant-popover-inner{
    background-color: var(--hv-popover-bg);
  }

  .ant-popover-message{
    color: var(--hv-popover-color);
  }

  .ant-btn {
    &:not(.ant-btn-primary) {
      background-color: var(--hv-popover-btn-bg);
      color: var(--hv-popover-color);
      border-color: var(--hv-popover-btn-bor-color);
      &:hover{
        border-color: var(--hv-primary-color);
        color: var(--hv-primary-color);
      }
    }
  }
}

// 下拉
.hv-dark-select-dropdown {
  background-color: var(--hv-dark-select-dropdown-bg);
  color: var(--hv-dark-select-dropdown-color);

  .ant-select-item-option {
    color: var(--hv-dark-select-dropdown-color);
  }

  .ant-select-item-option-selected {
    &:not(.ant-select-item-option-disabled) {
      background-color: var(--hv-dark-select-dropdown-item-select-bg);
      color: var(--hv-dark-select-dropdown-color);
    }
  }

  .ant-select-item-option-active {
    &:not(.ant-select-item-option-disabled) {
      background-color: var(--hv-dark-select-dropdown-item-hov-bg);
      color: var(--hv-dark-select-dropdown-color);
    }
  }

  .ant-select-item-empty {
    color: var(--hv-dark-select-dropdown-color);
  }
}

//在设计器下的
.hv-dashboard-designer, .hv-dark-dialog {
  // ------tabs------
  .ant-tabs {
    color: var(--hv-tabs-color);

    .ant-tabs-bar {
      border-bottom-color: var(--hv-dark-bor-color);
    }

    .ant-tabs-nav {
      &::before {
        border-bottom-color: var(--hv-dark-bor-color);
      }
    }

    .ant-tabs-tab-prev {
      color: var(--hv-dark-color);
    }

    .ant-tabs-tab-next {
      color: var(--hv-dark-color);
    }
  }

  // ------collapse------
  .ant-collapse {
    border: 0;
    border-radius: 0;
    background-color: var(--hv-dark-collapse-bg);
    color: var(--hv-dark-collapse-color);

    .ant-collapse-item {
      border-bottom-color: var(--hv-dark-bor-color);
      .ant-collapse-header {
        padding: 8px;
        color: var(--hv-dark-collapse-color);
        border-left: 2px solid var(--hv-primary-color);
      }
    }
  }

  .ant-collapse-content-box {
    padding: 0px;
  }

  .ant-collapse-arrow {
    left: 12px;
  }

  .ant-collapse-content {
    background-color: var(--hv-dark-collapse-content-bg);
    color: var(--hv-dark-collapse-color);
    border-top-color: var(--hv-dark-bor-color);
  }

  // ------input-number------
  .ant-input-number {
    border-color: var(--hv-dark-input-bor-color);
    color: var(--hv-dark-input-color);
    background-color: var(--hv-dark-input-bg);
    height: var(--hv-dark-input-height);
  }

  .ant-input-number-handler-wrap {
    background: var(--hv-dark-input-bg);
    border-left-color: var(--hv-dark-input-bor-color);
    color: var(--hv-dark-input-color);

    :active {
      background: var(--hv-dark-btn-active-bg);
    }
  }

  .ant-input-number-input-wrap {
    height: var(--hv-dark-input-height);

    input {
      height: var(--hv-dark-input-height);
      line-height: var(--hv-dark-input-height);
    }
  }

  .ant-input-number-handler-down {
    border-top-color: var(--hv-dark-input-bor-color);
  }

  .ant-input-number-handler {
    color: var(--hv-dark-input-color);
    border-left-color: var(--hv-dark-input-bor-color);
  }

  .ant-input-number-handler-up-inner {
    color: var(--hv-dark-input-color);
  }

  .ant-input-number-handler-down-inner {
    color: var(--hv-dark-input-color);
  }

  // ------input------
  .ant-input-affix-wrapper {
    border: 0;
    background-color: var(--hv-dark-input-bg);
  }

  .ant-input {
    border-color: var(--hv-dark-input-bor-color);
    color: var(--hv-dark-input-color);
    background-color: var(--hv-dark-input-bg);
    height: var(--hv-dark-input-height);
  }

  // ------select------
  .ant-select-selector {
    background: var(--hv-dark-input-bg);
    border-color: var(--hv-dark-input-bor-color);
    color: var(--hv-dark-input-color);
    height: var(--hv-dark-input-height);

    .ant-select-selection-item {
      line-height: var(--hv-dark-input-height);
    }
    .ant-select-selection-search-input {
      height: var(--hv-dark-input-height);
    }
  }

  .ant-select:not(.ant-select-customize-input) .ant-select-selector {
    background: var(--hv-dark-input-bg);
    border-color: var(--hv-dark-input-bor-color);
    color: var(--hv-dark-input-color);
    height: var(--hv-dark-input-height);
  }

  .ant-select-arrow {
    color: var(--hv-dark-input-color);
  }

  // ------checkbox------
  .ant-checkbox-wrapper {
    color: var(--hv-dark-input-color);
  }

  .ant-checkbox-inner {
    background: var(--hv-dark-input-bg);
    border-color: var(--hv-dark-input-bor-color);
  }

  .ant-checkbox-checked {
    .ant-checkbox-inner {
      background: var(--hv-primary-color);
      border-color: var(--hv-dark-input-bor-color);
    }

    &::after {
      border-color: var(--hv-dark-input-bor-color);
    }
  }

  // ------switch------
  .ant-switch {
    margin-top: -4px;
  }

  // ------designer btn------
  .hv-designer-btn {
    background: var(--hv-dark-btn-bg);
    border-color: var(--hv-dark-btn-bor-color);
    color: var(--hv-dark-btn-color);
    span {
      &:last-of-type {
        margin-right: 2px;
      }
    }

    &:hover {
      background: var(--hv-dark-btn-hov-bg);
      border-color: var(--hv-dark-btn-hov-bg);
    }
  }
  .ant-form-item-label{
    label{
      color: var(--hv-dark-color);
    }
  }
}
